<template>
	<div class="nav nanv1">
		<div :class="['nav_box', nav_class, w_class]">
			<van-icon class="return" name="arrow-left" @click="routerback()"/>
			<!-- <span
				class="iconfont icon-return return"
				:style="{ color: r_color }"
				@click="routerback()"
			></span> -->
			<span class="title">{{ title }}</span>
			<slot name="right_slot"></slot>
		</div>
		<div class="placeholderbox"></div>
	</div>
</template>

<script>
import { Dialog } from "vant";

export default {
	data() {
		return {};
	},
	props: ["title", "nav_class", "r_color", "routerurl", "parms", "w_class", "emit"],
	mounted() {
	},
	methods: {
		routerback: function () {
			if(Dialog){
				Dialog.close();
			}
			if(this.emit && this.emit != undefined) {
				this.$emit(this.emit)
				return false
			}
			let ua = navigator.userAgent.toLowerCase(); // 这里将所有字母转小写
			let isquark= ua.indexOf('quark') !== -1
			// 如果落地页过来的直接返回上一步
			let from=this.$route.query.from||null;
			if (this.routerurl&&from&&from=='land-page') {
				this.$router.back(-1);
			}else if(this.routerurl) {
				this.$router.replace({
					path: this.routerurl,
					query: this.parms,
				});
			} else {
				if (window.history.length-1 <= 2) {
					// console.log('上一页--5');
					this.$router.push("/");
				} else {
					if(this.$parent.fromPath) {
						this.$router.replace({path: this.$parent.fromPath.path})
					} else {
						if (isquark) {// 处理夸克返回到浏览器首页问题。
							this.$router.push("/");
						}else{//原逻辑不变，其他浏览器
							this.$router.back(-1);
						}
					}
				}
			}
		},
	},
};
</script>
<style lang='less' scoped>
.placeholderbox {
	height: 88px;
}
.nav_box {
	width: 100%;
	top: 0;
	left: 0;
	bottom: 0;
	height: 88px;
	line-height: 88px;
	text-align: center;
	position: fixed;
	background: #fff;
	z-index: 222;//需求863，层级过高先改为222
	.return {
		position: absolute;
		left: 0px;
		top: 50%;
		transform: translate(0 ,-50%);
		font-size: 50px;
		z-index: 3;
	}
	.title {
		font-size: 36px;
		font-weight: bold;
		width: 40px;
		display: inline-block;
		overflow: hidden;
		/*超出部分隐藏*/
		text-overflow: ellipsis;
		/* 超出部分显示省略号 */
		white-space: nowrap;
		/*规定段落中的文本不进行换行 */
		// 1045 优化
		position: absolute;
		padding: 0 100px;
		width: 100%;
		left: 0;
		right: 0;
	}
	@media screen and (min-width: 1100px) {
		.title {
		width: 100%!important;
		}
	}
}
.w_class {
	.title {
		font-size: 36px;
		font-weight: bold;
		display: inline-block;
		overflow: hidden;
		/*超出部分隐藏*/
		text-overflow: ellipsis;
		/* 超出部分显示省略号 */
		white-space: nowrap;
		/*规定段落中的文本不进行换行 */
	}
}
.bluestyle {
	color: #fff;
	background: linear-gradient(0deg, rgba(0, 102, 255, 1), rgba(0, 153, 255, 1));
}
</style>
